<script lang="ts" setup>

    import { ref,reactive,computed } from 'vue'
    const firstName=ref("wang")
    const lastName=ref("wu")
    //计算属性 有缓存
    const fullName=computed(()=>{
        let full=firstName.value+"-"+lastName.value
        console.log(full)
        return full
    })
    // 只要用到，就要调用一次
    function fn(){
        let full=firstName.value+"-"+lastName.value
        console.log(full)
        return full
    }
</script>

<template>
    姓:{{ firstName }}<br>
    名:{{ lastName }}<br>
    全名:{{ fullName }}
    全名:{{ fullName }}
    全名:{{ fullName }}

    全名:{{ fn() }}<br>
    全名:{{ fn() }}<br>


</template>

<style scoped>


</style>
